<template>
    <div>
        <van-dropdown-menu>
            <van-dropdown-item disabled title="综合" />
            <van-dropdown-item title="价格"  @change='priceChange' v-model="priceVal" :options="option2" />
            <van-dropdown-item @change='categoryChange' title="分类" v-model="categoryVal" :options="filterCategory" />
        </van-dropdown-menu>

        <van-empty image="search" description="没有相应商品哦"  v-if="goodsList.length==0"/>
        <Products  v-else
        :goodsList="goodsList" />
    </div>
</template>

<script>
import Products from "./Products"
export default {
    data () {
        return {
            priceVal:'desc',
            categoryVal: '',
            option2: [
                { text: '价格由高到低', value: 'desc' },
                { text: '价格由低到高', value: 'asc' },
               
            ],
 
        }
    },  
    //数据挂载完毕遍历分类数组为true的选中的分类
    beforeUpdate() {
        this.filterCategory.map(item=>{
              if(item.checked){
                  this.CategoryVal = item.value
              }
        })
    },
    props:["filterCategory","goodsList"],
    components:{
        Products
    },
    methods: {
        categoryChange(value){
            this.$emit("categoryChange",value)
        },
         priceChange(value){
            //  console.log(value)
            this.$emit("priceChange",value)
        }

    },
}
</script>
 
<style lang = "less" scoped>
    
</style>